<template>
	<div class="ele-body">
		<el-tabs v-model="activeName" @tab-click="handleClick" type="border-card" v-if="dictlist.length>0">
			<el-tab-pane v-for="item in dictlist" :label="item.name" :name="item.name" :key="item.id">
				<el-tabs v-model="activeNamess" :tab-position="tabPosition" @tab-click="handleClickss">
					<el-tab-pane v-for="items in dictdatalist" :label="items.name" :name="items.name" :key="items.id">
						<div style="margin-left: 32px;margin-right: 32px;width: 100%;">

							<el-button v-if="source.source_id==items.id" @click="add(1)"
								type="primary">添加{{items.name}}</el-button>
							<el-button v-else @click="add(0)" type="primary">添加{{items.name}}</el-button>

							<el-table :data="tableData" stripe style="width: 100%;margin-top: 18px;" row-key="id"
								default-expand-all :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
								v-if="source.source_id==items.id">
                <el-table-column
                     label="序号"
                     type="index"
                     width="50">
                   </el-table-column>
								<el-table-column prop="value" label="患者来源" align="center">
								</el-table-column>
								<el-table-column prop="name" label="具体来源" align="center">
								</el-table-column>
								<el-table-column prop="status_text" label="状态" align="center">
								</el-table-column>
								<el-table-column label="操作" align="center">
									<template slot-scope="scope">
										<div v-if="scope.row.children">
											<el-button @click="sourceStatus(scope.row)"
												v-if="scope.row.status=='hidden'" type="danger">启用</el-button>


											<el-button @click="sourceStatus(scope.row)"
												v-if="scope.row.status=='normal'" type="danger">停用</el-button>
										</div>
										<div v-else>

											<el-button @click="status(scope.row)" v-if="scope.row.status=='hidden'"
												type="danger">启用</el-button>
											<el-button @click="status(scope.row)" v-if="scope.row.status=='normal'"
												type="danger">停用</el-button>
										</div>
									</template>
								</el-table-column>
							</el-table>

							<el-table :data="tableData" stripe style="width: 100%;margin-top: 18px;" row-key="id"
								default-expand-all :tree-props="{children: 'children', hasChildren: 'hasChildren'}" v-else>
                 <el-table-column
                      label="序号"
                      type="index"
                      width="50">
                    </el-table-column>
								<el-table-column prop="name" label="名称" align="center">
								</el-table-column>
								<el-table-column prop="quanpin" label="全拼" align="center">
								</el-table-column>
								<el-table-column prop="jianpin" label="简拼" align="center">
								</el-table-column>
								<el-table-column prop="updatetime" label="更新时间" align="center" :formatter="formatDate">
								</el-table-column>
                <el-table-column
                     label="排序"
                     prop="id"
                      align="center"
                       width="50"
                  >
                 </el-table-column>
								<el-table-column prop="status_text" label="状态" align="center">
								</el-table-column>
								<el-table-column label="操作" align="center">
									<template slot-scope="scope">
                    <el-button v-if="items.quanpin == 'yj_cate' && scope.row.p_id==41" type="primary" @click="add(0,items.quanpin)">添加子类</el-button>
										<el-button @click="edit(0,scope.row,items.quanpin)" type="primary">编辑</el-button>
										<el-button @click="status(scope.row)" v-if="scope.row.status=='hidden'"
											type="danger">启用</el-button>

										<el-button @click="status(scope.row)" v-if="scope.row.status=='normal'"
											type="danger">停用</el-button>
									</template>
								</el-table-column>
							</el-table>

							<div class="block" style="margin-top: 18px;" v-if="source.source_id!=items.id">
								<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
									:current-page.sync="page" :page-sizes="[10]" :page-size="10"
									layout="total,sizes, prev, pager, next" :total="total">
								</el-pagination>
							</div>
						</div>
					</el-tab-pane>
				</el-tabs>
			</el-tab-pane>
		</el-tabs>
		<!-- 添加弹窗 -->
		<el-dialog :title="form.id>0?'修改':'添加'" :visible.sync="dialogVisible" width="30%" :close-on-click-modal="false">

			<el-form ref="form" :model="form" label-width="80px" >
        <el-form-item label="上级分类" v-if="yj_list.length>0">
        	<el-select v-model="form.p_ids" placeholder="上级分类" clearable>
        		<el-option v-for="item in yj_list" :label="item.name" :value="item.id"
        			:key="item.id"></el-option>
        	</el-select>
        </el-form-item>
				<el-form-item label="名称">
					<el-input v-model="form.name" clearable></el-input>
				</el-form-item>
				<el-form-item label="全拼">
					<el-input v-model="form.quanpin"></el-input>
				</el-form-item>
				<el-form-item label="简拼">
					<el-input v-model="form.jianpin"></el-input>
				</el-form-item>
				<el-form-item label="排序">
					<el-input v-model="form.weigh"></el-input>
				</el-form-item>
			</el-form>

			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisible = false">取 消</el-button>
				<el-button type="primary" @click="dictdata()">确 定</el-button>
			</span>
		</el-dialog>

		<el-dialog :title="form.id>0?'编辑':'添加'" :visible.sync="dialogVisiblesource" width="30%" :close-on-click-modal="false">

			<el-form ref="form" :model="form" label-width="80px">
				<el-form-item label="患者来源">
					<el-select v-model="form.source" placeholder="请选择患者来源" clearable>
						<el-option v-for="item in source.list" :label="item.value" :value="item.source"
							:key="item.source"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="具体来源">
					<el-input v-model="form.name"></el-input>
				</el-form-item>
				<el-form-item label="排序">
					<el-input v-model="form.weigh"></el-input>
				</el-form-item>
			</el-form>

			<span slot="footer" class="dialog-footer">
				<el-button @click="dialogVisiblesource = false">取 消</el-button>
				<el-button type="primary" @click="dictdata()">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				dictlist: [],
				activeName: '',
				tabPosition: 'left',
				dict_id: 0,
				dictdatalist: [],
				activeNamess: '',
				p_id: 0,
				tableData: [],
				page: 1,
				size: 10,
				total: 0,
				dialogVisiblesource: false,
				dialogVisible: false,
				form: {
					source: '',
					name: '',
					weigh: '',
          pids:''
				},
				source: {},
        yj_list:{}
			};
		},
		mounted() {
			this.getindex();
			this.gethuanzhe();
		},
		methods: {
			// 获取患者来源ID和类型（线上线下）
			gethuanzhe() {
				this.$http.get('/back/dictdata/getSourceType').then((res) => {
					this.source = res.data.data;
				});
			},
      //医院技分类
      get_yj_cate() {
      	this.$http.get('/back/dictdata/getYjOneCate').then((res) => {
      		this.yj_list = res.data.data;
      	});
      },
			//获取类型
			getindex() {
				this.$http.get('/back/dict/index').then((res) => {
					this.dictlist = res.data.data;
					this.activeName = res.data.data[0].name;
					this.dict_id = res.data.data[0].id;
					this.getonelist();
				});
			},
			//获取一级分类
			getonelist() {
				this.$http.get('/back/dictdata/getOneLevel?dict_id=' + this.dict_id).then((res) => {
					this.dictdatalist = res.data.data;
					this.activeNamess = res.data.data[0].name;
					this.p_id = this.dictdatalist[0].id;
					this.page=1;
					this.getitemsmsg();
				});
			},
			//获取一级分类的详情
			getitemsmsg() {
				if (this.source.source_id == this.p_id) {
					this.$http.get('/back/dictdata/getSourceList').then((res) => {
						this.tableData = res.data.data;
					});
				} else {
					this.$http.get('/back/dictdata/getTwoLevel?page=' + this.page + '&size=' + this.size + '&p_id=' + this
						.p_id).then((res) => {
						this.tableData = res.data.data.data;
						this.total = res.data.data.total;
					});
				}
			},
			//切换类型获取一级分类
			handleClick(tab, event) {
				console.log(tab.index, event);
				this.dict_id = this.dictlist[tab.index].id;
				this.getonelist();
			},
			//切换一级分类获取详情
			handleClickss(tab, event) {
				console.log(tab.index, event);
				this.p_id = this.dictdatalist[tab.index].id;
				this.page=1;
				this.getitemsmsg();
			},
			//特殊启用停用
			sourceStatus(row) {
				let msg = '';
				if (row.status == 'normal') {
					msg = '停用';
				} else {
					msg = '启用';
				}
				this.$confirm('确定将状态修改为' + msg + '?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$http.post('/back/dictdata/sourceStatus', {
						id: row.id
					}).then((res) => {
						if (res.data.code == 1) {
							this.$message({
								message: res.data.msg,
								type: 'success'
							});
							this.getitemsmsg();
						} else {
							this.$message.error(res.data.msg);
						}
					});
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消操作'
					});
				});
			},
			//启用停用
			status(row) {
				let msg = '';
				if (row.status == 'normal') {
					msg = '停用';
				} else {
					msg = '启用';
				}
				this.$confirm('确定将状态修改为' + msg + '?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					this.$http.post('/back/dictdata/status', {
						id: row.id
					}).then((res) => {
						if (res.data.code == 1) {
							this.$message({
								message: res.data.msg,
								type: 'success'
							});
							this.getitemsmsg();
						} else {
							this.$message.error(res.data.msg);
						}
					});
				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消操作'
					});
				});
			},
			add(e,type=''){
				this.form={};
				if(e==0){
					this.dialogVisible=true;
				}else{
					this.dialogVisiblesource=true;
				}
        if(type == 'yj_cate'){
          this.get_yj_cate();
          this.form.pids = this.form.pid
        }else{
          this.yj_list = []
        }
			},
			edit(e,row,type=''){
				this.form={};
				this.form={...row};
				if(e==0){
					this.dialogVisible=true;
				}else{
					this.dialogVisiblesource=true;
				}
        if(type == 'yj_cate'){


           this.form.p_ids = this.form.p_id
           if(this.form.p_id == 41){
             this.yj_list = []
           }else{
             this.get_yj_cate();
           }
           
           console.log(this.form.p_ids,'3333333333323');
        }else{
          this.yj_list = []
        }
			},
			//添加和修改
			dictdata() {

				this.form.p_id = this.p_id;
				this.$http.post('/back/dictdata/edit', this.form).then((res) => {
					if (res.data.code == 1) {
						this.$message({
							message: res.data.msg,
							type: 'success'
						});
						this.dialogVisible=false;
						this.dialogVisiblesource=false;
						this.getitemsmsg();
					} else {
						this.$message.error(res.data.msg);
					}
				});
			},
			//格式化时间
			formatDate(row,column){
				let data = row[column.property]
				if(data == null){
					return null
				}
				let dt = new Date(data*1000)
				let Month=dt.getMonth()+1 < 10 ? '0'+(dt.getMonth()+1) : dt.getMonth()+1;
				let Day=dt.getDate() < 10 ? '0'+(dt.getDate()) : dt.getDate();
				let Hours=dt.getHours() < 10 ? '0'+(dt.getHours()) : dt.getHours();
				let Minutes=dt.getMinutes() < 10 ? '0'+(dt.getMinutes()) : dt.getMinutes();
				let Seconds=dt.getSeconds() < 10 ? '0'+(dt.getSeconds()) : dt.getSeconds();
				return dt.getFullYear()+'-'+Month+'-'+Day+' '+Hours+':'+Minutes+':'+Seconds
			},
			handleSizeChange(val) {
				console.log(`每页 ${val} 条`);
			},
			handleCurrentChange(val) {
				console.log(`当前页: ${val}`);
				this.page=val;
				this.getitemsmsg();
			}
		}
	};
</script>

<style lang="scss" scoped>
</style>
